<template>
  <el-dialog v-model="visible" title="个人信息" width="73vw" append-to-body>
    <div class="patient-content">
      <div class="patient-item">
        <div class="title">患者信息</div>
        <PatientInfo :edit="true" :patient="patient" />
      </div>
      <div class="patient-item">
        <div class="title">
          住院信息
          <div class="sub-title">入院:{{ new Date().getFullYear() }}年第1次/累计第1次</div>
        </div>
        <HospitalizationInfo :edit="true" :patient="admission" />
      </div>
    </div>
  </el-dialog>
</template>

<script setup name="PatientDetailDialog">
import PatientInfo from '@/views/chargingWork/admissionRegistration/components/PatientInfo.vue'
import HospitalizationInfo from '@/views/chargingWork/admissionRegistration/components/HospitalizationInfo.vue'
const props = defineProps({
  modelValue: { type: Boolean, default: false },
  patient: { type: Object, default: () => ({}) },
  admission: { type: Object, default: () => ({}) }
})
const emit = defineEmits(['update:modelValue'])
const visible = computed({
  get: () => props.modelValue,
  set: v => emit('update:modelValue', v)
})
</script>

<style scoped lang="scss">
@use '@/assets/styles/variables.module.scss' as *;
.patient-content {
  padding: $padding-md;
}
.patient-item {
  margin-bottom: $margin-md;
}
.title {
  height: 36px;
  line-height: 36px;
  border: solid $border-color;
  border-width: 1px 1px 0 1px;
  padding: 0 $padding-sm;
  display: flex;
  align-items: center;
}
.sub-title {
  font-size: $font-size-sm;
  margin-left: $margin-sm;
  display: inline-flex;
}
</style>
